@import "@/lib/reset.scss";

.header{
  font-family: PingFang SC;
  /deep/.van-nav-bar__arrow {
    font-size: 0.2rem;
    color: #000;
  }
  
  .stranger-info {
    @include rect(100%, auto);
    @include flexbox();
    @include flex-direction(column);
    @include justify-content();
    @include align-items();
    @include color(#1C1C1C);
    font-weight: 500;
    padding-top: 0.1rem;

    img {
      @include rect(0.8865rem, 0.8865rem);
      @include border-radius(50%);
    }

    h3 {
      @include font-size(0.16rem);
      position: relative;
      left: 0.1rem;
      margin: 0.08rem 0;

      .avatar {
        @include display(inline-block);
        @include rect(0.15rem, 0.15rem);
        position: relative;
        top: 0.012rem;
        background: url('./../../assets/img/nan.png') no-repeat center center/ 0.15rem 0.15rem;
      }
    }
    
    p {
      @include font-size(0.12rem);
      font-weight: Bold;
      span {
        @include font-size(0.18rem);
        font-weight: 500;
        &:nth-child(2) {
          padding-left: 0.455rem;
        }
      }
    }

    button {
      @include rect(3.42rem, 0.435rem);
      @include border-radius(0.2175rem);
      @include background-color(#F6F7F9);
      @include color(rgba(28, 28, 28, .5));
      font-size: 0.18rem;
      border: none;
      outline: none;
      margin: 0.18rem 0;
      &.attented {
        background: #FDD949;
        color: #1C1C1C;
      }
    }
  }

  .statistics {
    >p {
      @include font-size(0.13rem);
      letter-spacing: 0.01rem;
      font-weight: bold;
      @include color(#1C1C1C);
      height: 0.345rem;
      line-height: 0.345rem;
      padding-left: 0.165rem;
      border-bottom: 0.01rem solid #F6F7F9;
    }
    >ul {
      @include flexbox();
      @include rect(100%, 0.75rem);

      li {
        @include flex();
        @include flexbox();
        @include flex-direction(column);
        @include justify-content();
        @include align-items();

        p {
          font-size: 0.16rem;
          font-weight: bold;
          @include color(#1C1C1C);
        }

        span {
          font-size: 0.13rem;
          font-weight: 500;
          @include color(#1C1C1C);
        }
      }
    }
  }

  .list-content {
    /deep/.van-tab--active, /deep/.van-tab {
      color: #000;
      @include font-size(0.13rem);
      font-weight: 500;
      flex: none;
      letter-spacing: 0.005rem;
      justify-content: flex-start;
      &:nth-child(1) {
        width: 0.9rem;
        padding-left: 0.16rem;
      }
    }
    /deep/.van-tabs--line .van-tabs__wrap {
      border-bottom: 1px solid #F4F4F4;
      height: 0.37rem;
    }
  }
}

/deep/.van-action-sheet__name {
  @include font-size(0.15rem);
  font-weight: Medium;
}
/deep/.van-action-sheet__gap {
  height: 0.05rem;
}
